import React, { Component } from "react";
import './DouyinDetail.css';
import axios from 'axios';

export default class DouyinDetail extends Component {
    state = {
        info: {}
    }

    render() {
        let {desc, video_local} = this.state.info;
        return (
            <div className="container video-show">
                <h3>{desc}</h3>
                <hr />
                <div className="video-show">
                    <video controls height="100%" 
                            src={video_local 
                                    ? 'http://cdn.xiaohigh.com' + video_local  
                                    : ''}></video>
                </div>
            </div>
        );
    }
    

    //生命周期回调
    async componentDidMount(){
        //
        let id = 12;
        //获取指定 id 的视频信息
        let result = await axios.get('http://api.xiaohigh.com/douyin/' + id);
        //保存视频数据
        this.setState({
            info: result.data
        })
    }

}
